<template>
  <div>
    <el-dialog
      title="操作日志"
      :visible.sync="operateLogDialog"
      width="width"
      @close="close"
    >
      <el-row :gutter="10" type="flex" justify="end">
        <el-input
          clearable
          @keyup.enter.native="searchClick"
          v-model="operationLogQuery.keyword"
          placeholder="请输入搜索内容"
          style="width: 200px"
        ></el-input>
        <el-button
          @click="searchClick"
          type="info"
          icon="el-icon-search"
          plain
        ></el-button>
      </el-row>
      <el-table :data="selAdminLogList" style="width: 100%" max-height="600px">
        <el-table-column
          prop="addtime"
          label="时间"
          width="width"
          align="center"
        >
          <template slot-scope="scope">
            {{ scope.row.addtime | dateFormat }}
          </template>
        </el-table-column>
        <el-table-column
          prop="content"
          label="操作"
          width="width"
          align="center"
        >
        </el-table-column>
        <el-table-column
          prop="ip"
          label="IP"
          width="width"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="ipAddr"
          label="IP归属地"
          width="width"
          align="center"
        >
        </el-table-column>
      </el-table>
      <el-row :gutter="10" justify="center" style="margin-top: 10px" type="flex">
        <el-pagination
          background
          :current-page="operationLogQuery.page"
          :page-sizes="[10, 20, 30,50]"
          :page-size="operationLogQuery.pageSize"
          layout="prev, pager, next"
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :total="total"
        >
        </el-pagination>
      </el-row>
    </el-dialog>
  </div>
</template>

<script>
import { selAdminLogApi } from "@/api/system";
export default {
  props: {
    operateLogDialog: {
      type: Boolean,
    },
  },
  data() {
    return {
      list: [
        {
          id: 2067,
          admin_id: 1,
          admin_name: "sys",
          content: "审核职位，{新媒体运营}(职位ID:1228)，待审核->已通过",
          is_login: 0,
          addtime: 1730280299,
          ip: "221.12.43.38:62836",
          ip_addr: "浙江省宁波市",
          type: 6,
          type_name: "审核",
        },
        {
          id: 2066,
          admin_id: 1,
          admin_name: "sys",
          content: "进入{宁波北仑博视眼科医院有限公司}(企业ID:475)会员中心",
          is_login: 0,
          addtime: 1730279839,
          ip: "221.12.43.38:30752",
          ip_addr: "浙江省宁波市",
          type: 1,
          type_name: "常规",
        },
        {
          id: 2065,
          admin_id: 1,
          admin_name: "sys",
          content: "修改系统-基础配置-系统配置-电子地图",
          is_login: 0,
          addtime: 1730279582,
          ip: "221.12.43.38:43392",
          ip_addr: "浙江省宁波市",
          type: 3,
          type_name: "修改",
        },
        {
          id: 2064,
          admin_id: 1,
          admin_name: "sys",
          content: "登录成功",
          is_login: 1,
          addtime: 1730279484,
          ip: "221.12.43.38:54470",
          ip_addr: "浙江省宁波市",
          type: 1,
          type_name: "常规",
        },
        {
          id: 1900,
          admin_id: 1,
          admin_name: "sys",
          content: "登录成功",
          is_login: 1,
          addtime: 1727678814,
          ip: "221.12.43.38:27060",
          ip_addr: "浙江省宁波市",
          type: 1,
          type_name: "常规",
        },
        {
          id: 1899,
          admin_id: 1,
          admin_name: "sys",
          content: "登录成功",
          is_login: 1,
          addtime: 1727663220,
          ip: "221.12.43.38:54148",
          ip_addr: "浙江省宁波市",
          type: 1,
          type_name: "常规",
        },
        {
          id: 1895,
          admin_id: 1,
          admin_name: "sys",
          content: "进入{宁波迅立光通信科技有限公司}(企业ID:468)会员中心",
          is_login: 0,
          addtime: 1727313798,
          ip: "221.12.43.38:47900",
          ip_addr: "浙江省宁波市",
          type: 1,
          type_name: "常规",
        },
        {
          id: 1894,
          admin_id: 1,
          admin_name: "sys",
          content: "进入{旭升集团}(企业ID:463)会员中心",
          is_login: 0,
          addtime: 1727313538,
          ip: "221.12.43.38:40798",
          ip_addr: "浙江省宁波市",
          type: 1,
          type_name: "常规",
        },
        {
          id: 1893,
          admin_id: 1,
          admin_name: "sys",
          content: "登录成功",
          is_login: 1,
          addtime: 1727312878,
          ip: "221.12.43.38:62032",
          ip_addr: "浙江省宁波市",
          type: 1,
          type_name: "常规",
        },
        {
          id: 1888,
          admin_id: 1,
          admin_name: "sys",
          content: "登录成功",
          is_login: 1,
          addtime: 1726708480,
          ip: "221.12.43.38:38842",
          ip_addr: "浙江省宁波市",
          type: 1,
          type_name: "常规",
        },
      ],
      operationLogQuery: {
        isLogin: 0,
        keyword: "",
        page: 1,
        pageSize: 10,
      },
      selAdminLogList: [],
    };
  },
  created() {
    this.selAdminLog();
  },
  methods: {
    // 渲染
    async selAdminLog() {
      const res = await selAdminLogApi(this.operationLogQuery);
      console.log(res);
      this.selAdminLogList = res.records;
      this.total = res.total;
    },
    // 查询
    searchClick() {
      this.selAdminLog();
    },
    // 选择多少页码
    handleSizeChange(pageSize) {
      console.log(pageSize);
      this.operationLogQuery.pageSize = pageSize;
      this.selAdminLog();
    },
    // 选择当前页码
    handleCurrentChange(page) {
      console.log(page);
      this.operationLogQuery.page = page;
      this.selAdminLog();
    },
    close() {
      this.$emit("update:operateLogDialog", false);
    },
  },
};
</script>

<style scoped></style>
